$(function () {
    $(".classif").show();

    //添加分类模态框点击显示
    $("#categoryMedol").click(function () {
        $('#myCategModal').modal("show")
    });
    var page = 1;
    var pageSize = 5;
    //分类列表渲染
    function render() {
        $.ajax({
            url: "/category/querySecondCategoryPaging",
            type: "GET",
            data: {
                page: page,
                pageSize: pageSize,
            },
            success: function (callback) {
                var html = template("subcategory-List", callback);
                $("tbody").html(html);

                $("#paginator").bootstrapPaginator({
                    bootstrapMajorVersion: 3,
                    currentPage: page,
                    totalPages: Math.ceil(callback.total / pageSize),
                    onPageClicked: function (a, b, c, index) {
                        page = index;
                        render();
                    }
                });
                //下拉框点击事件,选择一级分类

            }
        })
    }
    render();



    //模态框下拉列表渲染
    $.ajax({
        url: "/category/queryTopCategoryPaging",
        type: "GET",
        data: {
            page: 1,
            pageSize: 100
        },
        success: function (callback) {
            // console.log(callback);
            var html = template("subMadolCategory-List", callback);
            $(".dropdown-menu").append(html);
        }
    })

    //选择一级分类,并赋值给下拉按钮;    
    $("#categor-dropdown").on("click", "li a", function () {
        $("#dropdownMenu1").html($(this).html());
        $("input[name=categoryId]").val($(this).data("id"));

        var validator = $("form").data('bootstrapValidator');
        validator.updateStatus("categoryId", "VALID");
        
    })

      //上传图片
      $("#fileupload").fileupload({
        dataType: "json",
        //文件上传完成时，会执行的回调函数，通过这个函数就能获取到图片的地址
        //第二个参数就有上传的结果 data和服务器返回的数据并不完全一样
        done: function (e, data) {
            // console.log(data);
            $(".form-group img").attr("src", data.result.picAddr);
            $("input[name=brandLogo]").val(data.result.picAddr);

            //把表单元素的状态设为合法状态（验证通过）
            var validator = $("form").data('bootstrapValidator');
            validator.updateStatus("brandLogo", "VALID");
        }
    });



    // 表单验证
    var $form = $("form");

    //手动提交表单， 让下面的表单验证插件生效
    $("#myCategModal button[type=submit]").click(function () {
        $form.submit();
    });



    $form.bootstrapValidator({
        excluded: [],
        //2. 指定校验时的图标显示，默认是bootstrap风格
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },

        //3. 指定校验字段
        fields: {
            //校验用户名，对应name表单的name属性
            categoryId: {
                validators: {
                    //不能为空
                    notEmpty: {
                        message: '一级分类不能为空'
                    },

                }
            },

            brandName: {
                validators: {
                    //不能为空
                    notEmpty: {
                        message: '二级分类不能为空'
                    },

                }
            },

            brandLogo: {
                validators: {
                    //不能为空
                    notEmpty: {
                        message: '请选择图片'
                    },

                }
            },

        }

    });

    //表单验证成功之后的事件处理
    

    $form.on("success.form.bv", function (e) {
        //阻止默认事件（提交表单）
        e.preventDefault();
        
        $.ajax({
            url:"/category/addSecondCategory",
            type:"POST",
            data:$("form").serialize(),
            success:function(data){  
                if(data.success){
                    $("#myCategModal").modal("hide");
                    render();
                }
            }
        })
    });
    
     

})